import { App, Checkbox, Col, Descriptions, Form, Input, InputNumber, Modal, Radio, Row, Select, Tooltip } from 'antd';
import { useState, useEffect } from 'react'
import FetchHelper from '../../../../../../utils/helper/fetch-helper';
import MapPoint from '../../../../../framework/MapPoint';
import { getFields } from '../fields';
import XytjApi from '../../../../../../utils/apis/tj/XytjApi';

const A = props => {
    const { value, onChange, tooltip } = props;
    return <Tooltip title={tooltip}>
        <Input value={value} onChange={onChange} />
    </Tooltip>
}

export default function EditModal(props) {
    const { record, node } = props;
    const [form] = Form.useForm();
    const [loading, setLoading] = useState();

    const { message } = App.useApp();

    useEffect(() => {
        if (record) {
            form.setFieldsValue(record);
        }

    }, [form, record])

    return <Modal confirmLoading={loading} width={1000} onOk={e => {
        form.validateFields().then(values => {
            const data = {
                ...record,
                ...values,
            }
            if (record) {
                setLoading(true);
                XytjApi.update(data).then(resp => {
                    props.onOk?.()
                }).finally(e => {
                    setLoading(false);
                })
            } else {
                setLoading(true);
                XytjApi.add(data).then(resp => {
                    props.onOk?.()
                }).finally(e => {
                    setLoading(false);
                })
            }
        }).catch(err => {
            message.error(`${err?.errorFields?.[0]?.errors?.[0] || '验证失败'}`)
        })
    }} bodyStyle={{
        height: 600,
        padding: 24,
        overflow: 'auto'
    }} title={`${record ? "编辑" : "新增"}`} open={props.open} onCancel={e => props.onCancel?.()}>
        <Form form={form} labelAlign='right' labelCol={{ span: 6 }} labelWrap={{ span: 18 }}>

            <Row gutter={24}>
                {getFields(['区域名称', '地区生产总值', '第一产业增加值', '第二产业增加值', '第三产业增加值', '人均地区生产总值', '全社会固定资产投资总额',
                    '地方财政一般预算收入', '地方财政一般预算支出', '居民人均可支配收入', '城镇居民人均可支配收入', '农村居民人均可支配收入',
                    '社会消费品零售总额', '民用汽车拥有量', '电话普及率(包括移动电话)', '耕地面积', '粮食产量', '小麦播种面积', '玉米播种面积',
                    '水稻播种面积', '小麦产量', '玉米产量', '水稻产量', '小麦单位面积产量', '玉米单位面积产量', '水稻单位面积产量', '大牲畜数量',
                    '水产品产量', '主要农业机械拥有量', '农林牧渔业产值', '特色农作物种类', '高粱播种面积', '大豆播种面积', '马铃薯播种面积',
                    '甘薯播种面积', '花生播种面积', '油菜籽播种面积', '棉花播种面积', '甘蔗播种面积', '甜菜播种面积', '烟叶播种面积', '烤烟播种面积',
                    '蔬菜播种面积', '茶叶播种面积', '药材播种面积', '青稞播种面积', '西瓜播种面积', '柑桔播种面积', '苹果播种面积', '梨播种面积',
                    '葡萄播种面积', '甜瓜播种面积', '香蕉播种面积', '红枣播种面积', '草莓播种面积', '柿子播种面积', '菠萝播种面积', '高粱产量',
                    '大豆产量', '马铃薯产量', '甘薯产量', '花生产量', '油菜籽产量', '棉花产量', '甘蔗产量', '甜菜产量', '烟叶产量', '烤烟产量',
                    '蔬菜产量', '茶叶产量', '药材产量', '青稞产量', '西瓜产量', '柑桔产量', '苹果产量', '梨产量', '葡萄产量', '甜瓜产量', '香蕉产量',
                    '红枣产量', '草莓产量', '柿子产量', '菠萝产量', '高粱单位面积产量', '大豆单位面积产量', '马铃薯单位面积产量', '甘薯单位面积产量',
                    '花生单位面积产量', '油菜籽单位面积产量', '棉花单位面积产量', '甘蔗单位面积产量', '甜菜单位面积产量', '烟叶单位面积产量', '烤烟单位面积产量',
                    '蔬菜单位面积产量', '茶叶单位面积产量', '药材单位面积产量', '青稞单位面积产量', '西瓜单位面积产量', '柑桔单位面积产量', '苹果单位面积产量',
                    '梨单位面积产量', '葡萄单位面积产量', '甜瓜单位面积产量', '香蕉单位面积产量', '红枣单位面积产量', '草莓单位面积产量', '柿子单位面积产量', '菠萝单位面积产量'
                ]).map(item => {
                    let node = <InputNumber style={{ width: '100%' }} />
                    switch (item.type) {
                        case 'input':
                            node = <Input />;
                            break;
                        default:
                    }
                    return <Col span={12}>
                        <Form.Item label={item.title} name={item.dataIndex}>
                            {node}
                        </Form.Item>
                    </Col>
                })}

            </Row>
        </Form>
    </Modal>;
}